<!--  -->
<template>
  <div>
          <el-row class="topsearch">
        <el-col class="searform">
          <el-select
            size="medium"
            class="searchselect"
            v-model="optskey"
            placeholder="请选择"
          >
            <el-option
              v-for="item in opts"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
          <el-input
            class="inputtext"
            size="medium"
            placeholder="请输入内容"
            v-model="serachtext"
            clearable
          >
          </el-input>
          <el-button type="primary" size="medium" icon="el-icon-search"  @click="search()"
            >搜索</el-button
          >
        </el-col>
      </el-row>
  </div>
</template>

<script>
export default {
  name:'',
  components: {},
  props:['opts','optskey'],
  data () {
  return {
    serachtext:''
    }
  },
  computed: {},
  watch: {},
  created() {},
  mounted(){},
  methods: {
    search(){
      this.$emit('searchchild',this.optskey,this.serachtext)
    }
  }
}

</script>
<style lang='css'>

.topsearch {
  padding: 20px 20px 20px 20px;
  margin: 0 auto;
  background-color: #f3f3f3;
  text-align: center;
}
.searform {
  height: 50px;
  line-height: 50px;
}
.inputtext {
  width: 500px !important;
  height: 50px;
  line-height: 50px;
}
.searchselect {
  width: 100px;
}
</style>